<template>
  <div class="map-contant">
    <slot></slot>
  </div>
</template>
<script>
// -------------- 初始化 -------------------
import InitMapMixin from "../../components/AMap/mixins/initmap"
// -------------- AMap ----------------------
import {addMengBan} from "../../components/AMap/DistrictLayer";
import markMixins from "../../components/AMap/mark/markMixins"; // 麻点图层
import contextMenu from "../../components/AMap/contextMenu/contextMenu"; // 右键菜单
import DistricExplorer from "../../components/AMap/DistricExplorer/mixin/DistricExplorer"; //行政区划
import infoWindow from "../../components/AMap/infoWindow/infoWindow";//信息窗口
import ElasticMarker from "../../components/AMap/ElasticMarker/ElasticMarker"; //灵活点
// --------------- ws -----------------------
import wsMixin from "../../components/websocket/wsMixin";
import {getMobileList} from "../../api/work";

export default {
  mixins: [
    InitMapMixin,
    wsMixin,
    markMixins,
    contextMenu,
    DistricExplorer,
    infoWindow,
    ElasticMarker
  ],
  mounted() {
    //------------------------------
    addMengBan(this.map, this.adcode)
    this.socketInit(this.$wsUrlWork, this.onMessage);
  },
  data() {
    return {
      dataContent: [],
      workingData: [],
      broadData: [],
      p: undefined
    }
  },
  methods: {
    /**
     * 添加区划功能
     * */
    addDEfunction() {
      this.addTipmark();
      this.addGoInside();
      this.switchAreaNode(this.adcode, (e) => {
        console.error(e)
      })
    },
    //   ------------- ws ---------------
    /**
     * 接收消息后
     * @param e
     */
    onMessage: function (e) {
      let message = JSON.parse(e.data);
      let ml = message.data.mobile_list;
      let content = [];
      // 清除手机点
      this.cleatElasticMarker();
      //　创建手机点
      for (let i = 0; i < ml.length; i++) {
        let lnglat = ml[i].lnglat;
        if (lnglat === "x,x") {
          this.$message.error("坐标错误:[x,x]")
          continue
        }
        ml[i].lnglat = [Number(lnglat.split(",")[0]), Number(lnglat.split(",")[1])]
        ml[i].style = 1;
        this.createElasticMarker(ml[i].lnglat, ml[i]);
      }
      this.workingData = content;
      this.$emit("getWorkPhoneNum", message.data.count);
    }
  },
  props: {
    massmark: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  watch: {
    /**
     * 黑广播
     * @param val
     * @returns {number}
     */
    massmark: function (val) {
      if (val.length === 0) {
        return 0
      }
      this.cleatElasticMarkerMass();
      //　创建手机点
      for (let i = 0; i < val.length; i++) {
        if (val[i] === undefined) {
          continue
        }
        let lnglat = val[i].lnglat;
        if (lnglat === ["x", "x"]) {
          continue
        }
        val[i].style = 1;
        this.createElasticMassmark(val[i].lnglat, val[i]);
      }
      // this.setMassData(val);
    }
  }
};
</script>
<style scoped>
.map-contant {
  height: 100%;
  width: 100%;
}

.context_menu {
  position: relative;
  min-width: 6rem;
  padding: 0;
  background: #fff;
  height: 1.5vh;
  width: 3vw;
}
</style>
